<%@ page contentType="text/html;charset=UTF-8" pageEncoding="utf-8" language="java" %>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<html>
<head>
    <title>部门管理</title>
    <jsp:include page="/common/backend_common.jsp"/>
    <jsp:include page="/common/page.jsp"/>

    <script type="text/javascript">
        $(function(){
            //页面加载成功查询所有的
            $.get("${pageContext.request.contextPath}/sys/contract/ajax6",function(conCscNameList){
                console.log(conCscNameList)
                var $pro = $("#search-operator");
                $(conCscNameList).each(function(){
                    $pro.append($("<option value="+this+">"+this+"</option>"));
                });
            },"json");
        })

    </script>
</head>
<body class="no-skin" youdao="bind" style="background: white">
<input id="gritter-light" checked="" type="checkbox" class="ace ace-switch ace-switch-5"/>

<div class="page-header">
        <select id="search-operator" type="search" width="300px" name="operator" class=" input-sm" placeholder="施工单位" aria-controls="dynamic-table" style=" width:500px;text-align:center;margin-left: 280px;">
            <option>请选择施工单位</option>
        </select>
        <button class="btn btn-info fa fa-check research" style="margin-bottom: 6px; margin-left: 30px;" type="button">
            搜索
        </button>
</div>


<div class="col-sm-12">
    <div class="col-xs-12">
        <div class="table-header" style="text-align:center">
           合同简述列表
        </div>
        <div>
            <div id="dynamic-table_wrapper" class="dataTables_wrapper form-inline no-footer">
                <div class="row">
                    <div class="col-xs-12">
                        <div class="dataTables_length" id="dynamic-table_length">
                            <label>
                            展示
                            <select id="pageSize" name="dynamic-table_length" aria-controls="dynamic-table" class="form-control input-sm">
                                <option value="10">10</option>
                                <option value="25">25</option>
                                <option value="50">50</option>
                                <option value="100">100</option>
                            </select> 条记录
                            </label>
                        </div>
                    </div>
                </div>
                <div class="row pre-scrollable">
                <table id="dynamic-table" class="table table-striped table-bordered table-hover dataTable no-footer" role="grid"
                       aria-describedby="dynamic-table_info" style="font-size:14px;table-layout: fixed;word-break: break-all;">
                    <thead>
                    <tr role="row">
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="80px">
                            合同编号
                        </th>
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="80px">
                            合同类型
                        </th>
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="120px">
                            工程地址
                        </th>
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="120px">
                            施工单位
                        </th>
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="80px">
                            合同类型
                        </th>
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="120px">
                            工程地址
                        </th>
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="120px">
                            施工单位
                        </th>
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="60px">
                            工程状态
                        </th>
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="60px">
                            合同详情
                        </th>
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="120px">
                            工程地址
                        </th>
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="120px">
                            施工单位
                        </th>
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="80px">
                            合同类型
                        </th>
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="120px">
                            工程地址
                        </th>
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="120px">
                            施工单位
                        </th>
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="60px">
                            工程状态
                        </th>
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="60px">
                            合同详情
                        </th>
                        <th tabindex="0" aria-controls="dynamic-table" rowspan="1" colspan="1" width="80px">
                            任务单详情
                        </th>

                    </tr>
                    </thead>
                    <tbody id="contractList"></tbody>
                </table>
                </div>
                <div class="row" id="contractPage">
                </div>
            </div>
        </div>
    </div>
</div>

<div id="dialog-contract-form" width="1500px"height="700px" style="display: none; width: 1500px;">
    <form id="contractForm">
        <table class="table-striped table-bordered table-hover dataTable no-footer" role="grid" style="font-size:14px;table-layout: fixed;word-break: break-all;">

            <tr><th width="150px" height="40px" >合同ID</th><td id="conId" width="300px"></td>
                <th width="150px" height="40px" >合同编号</th><td id="conNo" width="300px"></td>
                <th width="150px" height="40px" >合同类型</th><td id="conType" width="300px"></td>
                <th width="150px" height="40px" >签订时间</th><td id="conSinTime" width="400px"></td></tr>
            <tr><th width="150px" height="40px" >签订地点</th><td id="conSinPlace" width="300px"></td>
                <th width="150px" height="40px" >出卖人</th><td id="conSeller" width="300px"></td>
                <th width="150px" height="40px" >买受人</th><td id="conBuyer" width="300px"></td>
                <th width="150px" height="40px" >单位编号</th><td id="conUniNo" width="400px"></td></tr>
            <tr><th width="150px" height="40px" >工程编号</th><td id="conProNo" width="300px"></td>
                <th width="150px" height="40px" >工程名称</th><td id="conProName" width="300px"></td>
                <th width="150px" height="40px" >建设单位</th><td id="conUnit" width="300px"></td>
                <th width="150px" height="40px" >工程地址</th><td id="conProPlace" width="400px"></td></tr>
            <tr><th width="150px" height="40px" >施工单位</th><td id="conCscUnit" width="300px"></td>
                <th width="150px" height="40px" >现场负责人</th><td id="conHead" width="300px"></td>
                <th width="150px" height="40px" >现场手机</th><td id="conPhone" width="300px"></td>
                <th width="150px" height="40px" >现场电话</th><td id="conTel" width="400px"></td></tr>
            <tr><th width="150px" height="40px" >付款方式</th><td id="conTerPay" width="300px"></td>
                <th width="150px" height="40px" >争议解决</th><td id="conReso" width="300px"></td>
                <th width="150px" height="40px" >其他约定</th><td id="conConvertion" width="300px"></td>
                <th width="150px" height="40px" >单位地址0</th><td id="conUniPlace0" width="400px"></td></tr>
            <tr><th width="150px" height="40px" >法定代表0</th><td id="conLegPerson0" width="300px"></td>
                <th width="150px" height="40px" >委托代表</th><td id="conAgent0" width="300px"></td>
                <th width="150px" height="40px" >电话0</th><td id="conTel0" width="300px"></td>
                <th width="150px" height="40px" >传真0</th><td id="conFax0" width="400px"></td></tr>
            <tr><th width="150px" height="40px" >邮编0</th><td id="conZipCode0" width="300px"></td>
                <th width="150px" height="40px" >银行账号</th><td id="conCard0" width="300px"></td>
                <th width="150px" height="40px" >单位地址1</th><td id="conUniPlace1" width="300px"></td>
                <th width="150px" height="40px" >委托代理1</th><td id="conLegPerson1" width="400px"></td></tr>
            <tr><th width="150px" height="40px" >电话1</th><td id="conTel1" width="300px"></td>
                <th width="150px" height="40px" >传真1</th><td id="conFax1" width="300px"></td>
                <th width="150px" height="40px" >邮编1</th><td id="conZipCode1" width="300px"></td>
                <th width="150px" height="40px" >银行账号1</th><td id="conCard1" width="400px"></td></tr>
            <tr><th width="150px" height="40px" >工程状态</th><td id="conProType" width="300px"></td>
                <th width="150px" height="40px" >结款状态</th><td id="conPayType" width="300px"></td>
                <th width="150px" height="40px" >运输距离</th><td id="conTraDis" width="300px"></td>
                <th width="150px" height="40px" >录入人</th><td id="conWriter" width="400px"></td></tr>
        </table>
    </form>
</div>


<!--

    <td>{{conProNo}}</td>
    <td>{{conProName}}</td>
    <td>{{conUnit}}</td>
<td>{{conProPlace}}</td>
    <td>{{conCscUnit}}</td>
    <td>{{conHead}}</td>
    <td>{{conPhone}}</td>
    <td>{{conTel}}</td>
    <td>{{conTerPay}}</td>
    <td>{{conReso}}</td>
    <td>{{conConvertion}}</td>
    <td>{{conUniPlace0}}</td>
    <td>{{conLegPerson0}}</td>
    <td>{{conAgent0}}</td>

 -->


<script id="contractListTemplate" type="x-tmpl-mustache">
{{#contractList}}
<tr role="row" class="contract-name odd" data-id="{{conId}}"><!--even -->
    <td>{{conNo}}</td>
    <td>{{conType}}</td>
    <td>{{conProPlace}}</td>
    <td>{{conCscUnit}}</td>
    <td>{{conProType}}</td>
    <td>{{conProPlace}}</td>
    <td>{{conCscUnit}}</td>
    <td>{{conProType}}</td>
    <td>{{conType}}</td>
    <td>{{conProPlace}}</td>
    <td>{{conCscUnit}}</td>
    <td>{{conProType}}</td>
    <td>{{conProPlace}}</td>
    <td>{{conCscUnit}}</td>
    <td>{{conProType}}</td>
    <td><a href="#" class="contract-edit" data-id="{{conId}}">合同详情</a> </td>
    <td><a href="/business/task.page?con_no={{conNo}}"  class="contract-tiaozhuan" data-id="{{conNo}}">任务单详情</a></td>
</tr>
{{/contractList}}
</script>

<script type="application/javascript">
    $(function() {

        $("th").css("white-space","nowrap");
        $("td").css("white-space","nowrap");

        var deptList; // 存储树形部门列表
        var deptMap = {}; // 存储map格式的部门信息
        var contractMap = {}; // 存储map格式的合同信息
        var optionStr = "";
        var lastClickDeptId = -1;

        loadcontractList();
        $(".research").click(function (e) {
            e.preventDefault();
            loadcontractList();
        });

        var deptListTemplate = $('#deptListTemplate').html();
        Mustache.parse(deptListTemplate);
        var contractListTemplate = $('#contractListTemplate').html();
        Mustache.parse(contractListTemplate);

        function loadcontractList() {
            var pageSize = $("#pageSize").val();
            var url = "/sys/contract/page.json";
            var pageNo = $("#contractPage .pageNo").val() || 1;
            var conCscUnit = $("#search-operator").val();

            $.ajax({
                url : url,
                data: {
                    pageSize: pageSize,
                    pageNo: pageNo,
                    conCscUnit: conCscUnit
                },
                success: function (result) {
                    rendercontractListAndPage(result, url);
                }
            })
        }

        function bindcontractClick() {
            $(".contract-edit").click(function(e) {
                e.preventDefault();
                e.stopPropagation();
                var contractId = $(this).attr("data-id");
                console.log("---------------zxl"+contractId);
                $("#dialog-contract-form").dialog({
                    model: true,
                    title: "合同详情",
                    open: function(event, ui) {
                        $(".ui-dialog-titlebar-close", $(this).parent()).hide();
                        $("#contractForm")[0].reset();

                        console.log(contractMap)
                        var data = contractMap[contractId];
                        console.log("------")
                        console.log(data)
                        if (data) {
                            $("#conId").html(data.conId);
                            $("#conNo").html(data.conNo);
                            $("#conType").html(data.conType);
                            $("#conSinTime").html(new Date(data.conSinTime).Format("yyyy-MM-dd hh:mm:ss"));
                            $("#conSinPlace").html(data.conSinPlace);
                            $("#conSeller").html(data.conSeller);
                            $("#conBuyer").html(data.conBuyer);
                            $("#conUniNo").html(data.conUniNo);
                            $("#conProNo").html(data.conProNo);
                            $("#conProName").html(data.conProName);
                            $("#conUnit").html(data.conUnit);
                            $("#conProPlace").html(data.conProPlace);
                            $("#conCscUnit").html(data.conCscUnit);
                            $("#conHead").html(data.conHead);
                            $("#conPhone").html(data.conPhone);
                            $("#conTel").html(data.conTel);
                            $("#conTerPay").html(data.conTerPay);
                            $("#conReso").html(data.conReso);
                            $("#conConvertion").html(data.conConvertion);
                            $("#conUniPlace0").html(data.conUniPlace0);
                            $("#conLegPerson0").html(data.conLegPerson0);
                            $("#conAgent0").html(data.conAgent0);
                            $("#conTel0").html(data.conTel0);
                            $("#conFax0").html(data.conFax0);
                            $("#conZipCode0").html(data.conZipCode0);
                            $("#conCard0").html(data.conCard0);
                            $("#conUniPlace1").html(data.conUniPlace1);
                            $("#conLegPerson1").html(data.conLegPerson1);
                            $("#conTel1").html(data.conTel1);
                            $("#conFax1").html(data.conFax1);
                            $("#conZipCode1").html(data.conZipCode1);
                            $("#conCard1").html(data.conCard1);
                            $("#conProType").html(data.conProType);
                            $("#conPayType").html(data.conPayType);
                            $("#conTraDis").html(data.conTraDis);
                            $("#conWriter").html(data.conWriter);
                        }
                    },
                    buttons : {
                        "返回": function () {
                            $("#dialog-contract-form").dialog("close");
                        }
                    }
                });
                $(".ui-dialog").css({
                    width:"80%",
                    "text-align":"center",
                    position:"fixed",
                    left:"10%",
                    top:"10%"
                })
            });
        }
        Date.prototype.Format = function (fmt) { //author: meizz
            var o = {
                "M+": this.getMonth() + 1, //月份
                "d+": this.getDate(), //日
                "h+": this.getHours(), //小时
                "m+": this.getMinutes(), //分
                "s+": this.getSeconds(), //秒
                "q+": Math.floor((this.getMonth() + 3) / 3), //季度
                "S": this.getMilliseconds() //毫秒
            };
            if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
            for (var k in o)
                if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
            return fmt;
        };
        function rendercontractListAndPage(result, url) {
            if (result.ret) {
                if (result.data.total > 0){
                    var rendered = Mustache.render(contractListTemplate, {
                        contractList: result.data.data
                    });
                    $("#contractList").html(rendered);
                    bindcontractClick();
                    $.each(result.data.data, function(i, contract) {
                        contractMap[contract.conId] = contract;
                    })
                } else {
                    $("#contractList").html('');
                }
                var pageSize = $("#pageSize").val();
                var pageNo = $("#contractPage .pageNo").val() || 1;
                renderPage(url, result.data.total, pageNo, pageSize, result.data.total > 0 ? result.data.data.length : 0, "contractPage", rendercontractListAndPage);
            } else {
                showMessage("获取部门下用户列表", result.msg, false);
            }
        }

    })
</script>
</body>
</html>
